<template>
	<div id="publicTalkFoot">
		<div class="weui-tabbar">
			<a href="javascript:;" class="weui-tabbar__item weui-bar__item_on">
				<span style="display: inline-block;position: relative;">
                        <img src="../../assets/img/speak.png" alt="" class="weui-tabbar__icon">
						</span>
			</a>
			<a href="javascript:;" class="weui-tabbar__item">
				<input type="text" class="foot_inp" v-on:click="test" />
			</a>
			<a href="javascript:;" class="weui-tabbar__item">
				<span style="display: inline-block;position: relative;">
                         <img src="../../assets/img/show.png" alt="" class="weui-tabbar__icon">
						</span>
			</a>
			<a href="javascript:;" class="weui-tabbar__item" v-show="flag">
				<img src="../../assets/img/waits/addes.png" alt="" class="weui-tabbar__icon">
			</a>
			<a href="javascript:;" class="weui-tabbar__item" id="weui-tabbar__btn" v-show="flags">
				<button class="foot_btn" @click="send">发送</button>
			</a>
		</div>

	</div>
</template>

<script>
	export default {
	  name: 'publicTalkFoot',
	  data () {
	    return {
	    	flag:true,
			flags:false
	    		
	    }
	  },
	  methods:{
	  	 test: function(flag){
	 			this.flag = false;
	 			this.flags=true
	 		} ,
	  	send: function(flag){
	 		this.flag = true;
	 		this.flags=false
	 		alert("发送内容不能为空")
	 	}
	  }
	}
</script>

<style>
	.weui-tabbar__icon {
		margin-top: 0.05rem;
		width: 0.2rem;
		height: 0.2rem;
	}
	
	.foot_inp {
		width: 2.6rem;
		height: 0.3rem;
		border: 0.01rem solid gainsboro;
	}
	
	.foot_btn {
		background-color: white;
		width: 0.35rem;
		height: 0.3rem;
		border: none;
		margin-left: -0.1rem;
		border: 0.01rem solid gainsboro;
	}
</style>